<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>箭头函数</title>
</head>
<body>
    <h1>箭头函数</h1>
    <p>是匿名函数的简写</p>
    <script>
        let add=function(a,b){
            return a+b;
        }
        let r=add(10,11)
        console.log(r);
        
        //箭头函数简化匿名函数
        let r1=(a,b)=>a+b;
        console.log(r1(10,12));//22
        let arr = [1,2,3,4]
        //使用foreach遍历
        arr.forEach(function(a){console.log(arr);
        })
        arr.forEach(a => console.log(a));
      
        //创建对象
        let car ={
            'name':'tom','color':'red'
        }
        let Car1=function(name,color){
            this.name=name;
            this.color=color;
        }
        let c = new Car1('benz','red');
        //箭头函数定义对象
        let stu=(id,name)=>{
            return{
                uid:id,
                uname:name

            }
        }
        //创建对象
        let s=stu('u1','tom');
        console.log(s.uid,s.uname);
        //打印参个数
        let m1=function(a,b){
            console.log(arguments);
             console.log(arguments[0]);
              console.log(arguments.length);
        }
        m1(19,30)
        let m2=(a,b)=>{
            //箭头函数中没有argument属性
            //console.log(arguments.length);
            
        }
        m2(1,2)
        let page={
            id:99,
            init:function(){
                document.addEventListener('click',(event)=>{
                    console.log(this);
                    this.doSomthing(event.type)
                    
                })
             },
                doSomthing:function(type){
                 console.log(type);
                 console.log(this.id);
               
            }
        }
        page.init();

         let page1={
            id:99,
            init:()=>{
                document.addEventListener('click',(event)=>{
                    console.log(this);
                    //箭头函数中 this表示为window对象
                    this.doSomthing(event.type)
                    
                })
             },
                doSomthing:function(type){
                 console.log(type);
                 console.log(this.id);
               
            }
        }
        page.init();
    </script>
</body>
</html>